<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>京东快报</title>
        <style type="text/css">
            *{
                margin:0px;
                padding:0px;
            }
            .box{
                width:230px;
                border:1px solid #ccc;
                margin:30px;
                box-sizing:border-box;
            }
            h3{
                color:#666;
                font-size:16px;
                height:40px;
                line-height:40px;
                padding-left: 15px;
                background-image:linear-gradient(-180deg,#cfcfff,#fbfbff)
            }
            li {
                list-style: none;
                padding-left:15px;
                font-size:12px;
                height:26px;
                line-height:26px;
                color: #999;

            }
            ul li:first-of-type{
                border-top:1px dotted purple;
                padding-top:8px;
            }
            span{
                font-weight:bold;
            }
            a:link{
                text-decoration:none;
                color:#666;
            }
            a:hover{
                color:darkred;
            }
            ul{
                padding-bottom:8px;
                margin-top:2px;
            }
        </style>
    </head>
    <body>
        <div class="box">
            <h3>京东快报</h3>
            <ul>
                <li><a href="#"><span>[特惠]</span>海飞丝去屑又去油 超清爽</a></li>
                <li><a href="#"><span>[公告]</span>京东公益支持鲁甸新动作</a></li>
                <li><a href="#"><span>[[特惠]</span>4688元抢iPhone 6</a></li>
                <li><a href="#"><span>[[公告]</span>小米电视携豪礼高调入驻京东</a></li>
            </ul>
        </div>
    </body>
</html>



